<template>
	<div class="content">
		<el-card class="box-card">
			<div class="tech-topView row" @click="goBack">
				<i class="el-icon-back" />
				<div class="el-title-text">编辑技师</div>
			</div>
			<div class="card-formView">

				<el-form ref="form" :model="form" :rules="rules">
					<div class="row">
						<image-preview :src="form.technicianAvatar" :width="80" :height="80" />
						<div class="rightTitle">
							<div>{{form.technicianName}}</div>
							<div class="titleRigId mt-md">ID: <span class="c-title">{{form.id}}</span></div>
							<div class="titleRigId">性别:<span class="c-title">{{form.technicianSex==0?'男' : '女'}}</span>
							</div>
						</div>
					</div>
					<div class="row phoneListTop">
						<div class="titleRigId mt-md">手机号: <span class="c-title">{{form.technicianTel}}</span></div>
						<div class="titleRigId mt-md mt-mr">申请时间: <span class="c-title">{{form.createTime}}</span></div>
						<div class="titleRigId mt-md mt-mr">分成等级: <span class="c-title">{{form.gradeName}}</span></div>
						<div class="titleRigId mt-md mt-mr">密码:-
							<el-button type="primary" plain size="small" @click="hanldButt">修改密码</el-button>
						</div>
						<!-- <div class="titleRigId mt-md mt-mr">是否接单:
							<el-switch v-model="form.isOnline" active-color="#409eff" inactive-color="#eee">
							</el-switch>
						</div> -->
					</div>

					<el-table v-loading="loading" :data="technicianList" class="elTable">
						<el-table-column label="账户余额" align="center" prop="balance" />
						<el-table-column label="评分" align="center" prop="mark" />
						<el-table-column label="服务时长" align="center" prop="totalServiceTime">
							<template slot-scope="scope">
								{{scope.row.totalServiceTime}}分钟
							</template>
						</el-table-column>
						<el-table-column label="在线时长" align="center" prop="totalOnlineTime" />
						<el-table-column label="加钟率" align="center" prop="addBellRate" />
					</el-table>
				</el-form>
			</div>
		</el-card>

		<el-card class="box-card">
			<el-tabs v-model="activeName" type="card" @tab-click="handleClick">
				<el-tab-pane label="基础信息" name="first">
					<el-form ref="form" :model="form" label-width="150px">
						<el-form-item label="技师类型" prop="technicianType">
							<el-select v-model="form.technicianType" placeholder="请选择">
								<el-option v-for="item in technicianTypeList" :key="item.id" :label="item.typeName"
									:value="item.id">
								</el-option>
							</el-select>
						</el-form-item>
						<el-form-item label="关联用户" prop="userName">
							<el-input v-model="form.userName" placeholder="请输入关联用户" class="elInput" :disabled='true' />
						</el-form-item>
						<el-form-item label="技师姓名" prop="technicianName">
							<el-input v-model="form.technicianName" placeholder="请输入技师姓名" class="elInput" />
						</el-form-item>
						<el-form-item label="性别" prop="technicianSex">
							<el-radio-group v-model="form.technicianSex">
								<el-radio v-for="dict in dict.type.sys_user_sex" :key="dict.value"
									:label="parseInt(dict.value)">{{dict.label}}</el-radio>
							</el-radio-group>
						</el-form-item>
						<el-form-item label="技师手机号" prop="technicianTel">
							<el-input v-model="form.technicianTel" placeholder="请输入技师手机号" class="elInput" />
						</el-form-item>
						<!-- <el-form-item label="意向工作城市" prop="serviceCity">
							<el-input v-model="form.serviceCity" placeholder="请输入意向工作城市" class="elInput" />
						</el-form-item> -->
						<el-form-item label="所属经纪人" prop="technicianInvitedCode">
							<el-select v-model="form.technicianInvitedCode" placeholder="请选择">
								<el-option v-for="item in brokerList" :key="item.brokerInvitationCode"
									:label="item.brokerName" :value="item.brokerInvitationCode">
								</el-option>
							</el-select>
						</el-form-item>
						<el-form-item label="挂靠门店" prop="merchantId">
							<el-select v-model="form.merchantId" placeholder="请选择">
								<el-option v-for="item in merchantList" :key="item.id" :label="item.merchantName"
									:value="item.id">
								</el-option>
							</el-select>
						</el-form-item>
						<!-- <el-form-item label="所在地址" prop="serviceCity">
							<el-input v-model="form.serviceCity" placeholder="请输入所在地址" class="elInput" />
						</el-form-item> -->
						<el-form-item label="白天免费距离" prop="dayFreeTolls">
							<el-input v-model="form.dayFreeTolls" placeholder="请输入白天免费距离" class="elInput">
								<template slot="append">km</template>
							</el-input>
						</el-form-item>

						<el-form-item label="晚上免费距离" prop="nightFreeTolls">
							<el-input v-model="form.nightFreeTolls" placeholder="请输入晚上免费距离" class="elInput">
								<template slot="append">km</template>
							</el-input>
						</el-form-item>
						<el-form-item label="服务距离" prop="serviceDistance">
							<el-input v-model="form.serviceDistance" placeholder="请输入服务距离" class="elInput">
								<template slot="append">km</template>
							</el-input>
						</el-form-item>
						<div class="lb-goods-edit-classify mb-lg row">
							<div class="title">技师提成比例</div>
							<span class="tips">对于新进平台的技师，且综合素质较好的，可以设置某个阶段固定高提成比例。提成比例和提成限期时间不填写，则默认走统一的浮动比例</span>
						</div>
						<el-form-item label="提成比例" prop="splitRate">
							<el-input v-model="form.splitRate" placeholder="请输入提成比例" class="elInput">
								<template slot="append">%</template>
							</el-input>
						</el-form-item>
						<el-form-item label="升级套餐分成比例" prop="upgradeSplitRate">
							<el-input v-model="form.upgradeSplitRate" placeholder="请输入加钟基础值" class="elInput">
								<template slot="append">%</template>
							</el-input>
						</el-form-item>
						<el-form-item label="第一次加钟分成比例" prop="bellFirstSplitRate">
							<el-input v-model="form.bellFirstSplitRate" placeholder="请输入加钟基础值" class="elInput">
								<template slot="append">%</template>
							</el-input>
						</el-form-item>
						<el-form-item label="第二次加钟分成比例" prop="bellSecondSplitRate">
							<el-input v-model="form.bellSecondSplitRate" placeholder="请输入加钟基础值" class="elInput">
								<template slot="append">%</template>
							</el-input>
						</el-form-item>
						<el-form-item label="生效开始日期" prop="effectStartTime">
							<el-date-picker clearable v-model="form.effectStartTime" type="datetime"
								value-format="yyyy-MM-dd HH:mm:ss" placeholder="请选择生效开始日期">
							</el-date-picker>
						</el-form-item>
						<el-form-item label="生效结束日期" prop="effectEndTime">
							<el-date-picker clearable v-model="form.effectEndTime" type="datetime"
								value-format="yyyy-MM-dd HH:mm:ss" placeholder="请选择生效结束日期">
							</el-date-picker>
						</el-form-item>
						<!-- <el-form-item label="提成限期时间" prop="effectStartTime">
							<el-date-picker v-model="form.effectStartTime" type="datetimerange" range-separator="至"
								start-placeholder="开始日期" end-placeholder="结束日期">
							</el-date-picker>
						</el-form-item> -->
						<div class="lb-goods-edit-classify mb-lg row">
							<div class="title">其他信息</div>
						</div>
						<el-form-item label="技师简介" prop="technicianIntro">
							<el-input type="textarea" placeholder="请输入内容" v-model="form.technicianIntro" maxlength="300"
								show-word-limit class="elInput" />
						</el-form-item>
						<el-form-item label="身份证号" prop="idCard">
							<el-input v-model="form.idCard" placeholder="请输入身份证号" class="elInput" />
						</el-form-item>
						<el-form-item label="生活照片" prop="lifePhoto">
							<image-upload v-model="form.lifePhoto" />
						</el-form-item>
					</el-form>
					<div class="dialog-footer">
						<el-button type="primary" @click="submitForm">提 交</el-button>
						<el-button @click="goBack">取 消</el-button>
					</div>
				</el-tab-pane>


				<el-tab-pane label="接单时间" name="second">
					<div class="secondTimes">
						<div class="dateChange row">
							<!-- <el-button size="mini" type="text" icon="el-icon-delete"
								@click="dateChage(item,index)">
								{{item.dates}}</el-button> -->
							<div v-for="(item , index) in checkTime" :key="index" class="mr-sr s-title"
								:class="{'cureTit': curretDate.index==index}" @click="dateChage(item,index)">
								<span>{{item.dates}}</span>

								<div class="lines" v-if="curretDate.index==index" />
							</div>
						</div>
						<div class="timeChangeBox row">
							<!-- @click="timeChage(item,index)" -->
							<div v-for="(item , index) in technicianTimeList" :key="index"
								class="date-item mr-md mt-md radius-10" :class="{'can-service':item.status==0}">
								<div class="f-mini-title">{{item.time}}</div>
								<div class="f-caption" v-if="item.status==0" @click="upDateState(item,1)">可预约</div>
								<div class="f-caption" v-if="item.status==1" @click="upDateState(item,0)">不可预约</div>
								<div class="f-caption" v-if="item.status==2">已被预约</div>
							</div>
						</div>
					</div>
				</el-tab-pane>


				<el-tab-pane label="已关联服务" name="third">
					<el-button type="primary" icon="el-icon-plus" @click="asociaBut">关联服务</el-button>
					<el-table v-loading="loading" :data="selectItem">
						<el-table-column label="ID" align="center" prop="id" />
						<el-table-column label="封面图" align="center" prop="mark">
							<template slot-scope="scope">
								<image-preview :src="scope.row.itemMainPicture" :width="50" :height="50" />
							</template>
						</el-table-column>
						<el-table-column label="服务名称" align="center" prop="itemName" />
						<el-table-column label="服务价格" align="center" prop="itemPrice" />
						<el-table-column label="服务会员价格" align="center" prop="itemMemberPrice" />
						<el-table-column label="服务时长" align="center" prop="itemTime">
							<template slot-scope="scope">
								{{scope.row.itemTime}}分钟
							</template>
						</el-table-column>
						<el-table-column label="操作" align="center" class-name="small-padding fixed-width" fixed="right">
							<template slot-scope="scope">
								<el-button type="danger" plain size="small "
									@click="handleDelete(scope.row)">取消关联</el-button>
							</template>
						</el-table-column>
					</el-table>

					<pagination v-show="total>0" :total="total" :page.sync="queryParams.pageNum"
						:limit.sync="queryParams.pageSize" @pagination="selectItemList" />
				</el-tab-pane>


				<el-tab-pane label="服务记录" name="four">
					<el-table v-loading="loading" :data="seleceTechList">
						<el-table-column label="ID" align="center" prop="id" />
						<el-table-column label="订单号" align="center" prop="orderNo" />
						<!-- <el-table-column label="项目名称" align="center" prop="itemName" /> -->
						<el-table-column label="项目图片" align="center" prop="aptitudePicture">
							<template slot-scope="scope">
								<div class="row">
									<image-preview :src="scope.row.itemPicture" :width="50" :height="50" />
									<div class="fourSelectInfo ">
										<div class="fourName ellipsis">{{scope.row.itemName}}</div>
										<div class="fourTime">时长：{{scope.row.itemTime}}分钟</div>
										<div class="rowFlex">
											<div class="fourTime fourPrice">￥{{scope.row.orderItemPrice}}</div>
											<span class="fourTime">x{{scope.row.orderNum}}</span>
										</div>
									</div>
								</div>

							</template>
						</el-table-column>
						<el-table-column label="支付方式" align="center" prop="payType">
							<template slot-scope="scope">
								<dict-tag :options="dict.type.pay_type" :value="scope.row.payType" />
							</template>
						</el-table-column>
						<el-table-column label="订单类型" align="center" prop="orderType">
							<template slot-scope="scope">
								<dict-tag :options="dict.type.order_type" :value="scope.row.orderType" />
							</template>
						</el-table-column>
						<el-table-column label="总金额" align="center" prop="orderTotalPrice" />
						<el-table-column label="优惠抵扣" align="center" prop="discountPrice" />
						<el-table-column label="实收金额" align="center" prop="realIncome" />
						<el-table-column label="下单时间" align="center" prop="placeOrderTime" width="180">
							<template slot-scope="scope">
								<span>{{ parseTime(scope.row.placeOrderTime) }}</span>
							</template>
						</el-table-column>
					</el-table>
					<pagination v-show="total>0" :total="total" :page.sync="queryParams.pageNum"
						:limit.sync="queryParams.pageSize" @pagination="selectGetList" />
				</el-tab-pane>



				<el-tab-pane label="资质信息" name="five">
					<el-button type="primary" icon="el-icon-plus" @click="handleAdd" class="mb-md">新增</el-button>
					<el-table v-loading="loading" :data="technicianAuthenticationList">
						<el-table-column label="资质ID" align="center" prop="id" />
						<el-table-column label="资质名称" align="center" prop="aptitudeName" />
						<el-table-column label="资质图片" align="center" prop="aptitudePicture">
							<template slot-scope="scope">
								<image-preview :src="scope.row.aptitudePicture" :width="50" :height="50" />
							</template>
						</el-table-column>
						<el-table-column label="创建时间" align="center" prop="createTime">
							<template slot-scope="scope">
								<span>{{ parseTime(scope.row.createTime) }}</span>
							</template>
						</el-table-column>
						<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
							<template slot-scope="scope">
								<el-button size="mini" type="text" icon="el-icon-edit" @click="authTechDela(scope.row)"
									v-hasPermi="['technicianAuthentication:technicianAuthentication:edit']">修改</el-button>
								<el-button size="mini" type="text" icon="el-icon-delete" @click="authDelete(scope.row)"
									v-hasPermi="['technicianAuthentication:technicianAuthentication:remove']">删除</el-button>
							</template>
						</el-table-column>
					</el-table>

					<pagination v-show="total>0" :total="total" :page.sync="queryParams.pageNum"
						:limit.sync="queryParams.pageSize" @pagination="authenGetList" />
				</el-tab-pane>

				<el-tab-pane label="屏蔽用户" name="six">
					<el-button type="primary" icon="el-icon-plus" class="mb-md" @click="handleAdd">新增</el-button>
					<el-form :model="sixParam" ref="queryFormSix" size="small" :inline="true" v-show="showSearch"
						label-width="68px">
						<el-form-item label="手机号" prop="userTel">
							<el-input v-model="sixParam.userTel" placeholder="请输入用户手机号" clearable
								@keyup.enter.native="handleQuery" />
						</el-form-item>
						<el-form-item>
							<el-button type="primary" icon="el-icon-search" size="mini"
								@click="handleQuery">搜索</el-button>
							<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
						</el-form-item>
					</el-form>

					<el-table v-loading="loading" :data="technicianShildList">
						<el-table-column label="ID" align="center" prop="id" />
						<el-table-column label="用户昵称" align="center" prop="userName" />
						<el-table-column label="用户手机号" align="center" prop="userTel" />
						<el-table-column label="屏蔽时间" align="center" prop="createTime" width="180">
							<template slot-scope="scope">
								<span>{{ parseTime(scope.row.createTime) }}</span>
							</template>
						</el-table-column>
						<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
							<template slot-scope="scope">
								<el-button size="mini" type="text" icon="el-icon-edit" @click="authTechDela(scope.row)"
									v-hasPermi="['technicianAuthentication:technicianAuthentication:edit']">修改</el-button>
								<el-button size="mini" type="text" icon="el-icon-delete" @click="authDelete(scope.row)"
									v-hasPermi="['technicianAuthentication:technicianAuthentication:remove']">删除</el-button>
							</template>
						</el-table-column>
					</el-table>
					<pagination v-show="total>0" :total="total" :page.sync="queryParams.pageNum"
						:limit.sync="queryParams.pageSize" @pagination="shieldGetList" />
				</el-tab-pane>


				<el-tab-pane label="银行卡" name="seven">
					<el-button type="primary" class="mb-md" icon="el-icon-plus" @click="handleAdd">新增</el-button>
					<el-table v-loading="loading" :data="technicianBackList">
						<el-table-column label="ID" align="center" prop="id" />
						<el-table-column label="银行卡名字" align="center" prop="backName" />
						<el-table-column label="银行卡号" align="center" prop="backIdcard" />
						<el-table-column label="所属分行" align="center" prop="backBranch" />
						<el-table-column label="持卡人姓名" align="center" prop="backUserName" />
						<!-- <el-table-column label="银行卡logo" align="center" prop="backLogo" width="100">
							<template slot-scope="scope">
								<image-preview :src="scope.row.backLogo" :width="50" :height="50" />
							</template>
						</el-table-column> -->
						<el-table-column label="创建时间" align="center" prop="createTime">
							<template slot-scope="scope">
								<span>{{ parseTime(scope.row.createTime) }}</span>
							</template>
						</el-table-column>
						<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
							<template slot-scope="scope">
								<el-button size="mini" type="text" icon="el-icon-edit" @click="authTechDela(scope.row)"
									v-hasPermi="['technicianBack:technicianBack:edit']">修改</el-button>
								<el-button size="mini" type="text" icon="el-icon-delete" @click="authDelete(scope.row)"
									v-hasPermi="['technicianBack:technicianBack:remove']">删除</el-button>
							</template>
						</el-table-column>
					</el-table>
					<pagination v-show="total>0" :total="total" :page.sync="queryParams.pageNum"
						:limit.sync="queryParams.pageSize" @pagination="backGetList" />
				</el-tab-pane>



				<el-tab-pane label="收入明细" name="eight">
					<el-form :model="eightParam" ref="queryForm" size="small" :inline="true" v-show="showSearch"
						label-width="68px">
						<el-form-item label="订单编号" prop="orderNo">
							<el-input v-model="eightParam.orderNo" placeholder="请输入订单编号" clearable
								@keyup.enter.native="handleQuery" />
						</el-form-item>
						<el-form-item label="资金状态" prop="priceStatus">
							<el-select v-model="eightParam.priceStatus" placeholder="请选择入账资金状态" clearable>
								<el-option v-for="dict in dict.type.price_status" :key="dict.value" :label="dict.label"
									:value="dict.value" />
							</el-select>
						</el-form-item>
						<el-form-item>
							<el-button type="primary" icon="el-icon-search" size="mini"
								@click="handleQuery">搜索</el-button>
							<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
						</el-form-item>
					</el-form>
					<el-table v-loading="loading" :data="technicianConsumeDetailList">
						<el-table-column label="ID" align="center" prop="id" />
						<el-table-column label="订单编号" align="center" prop="orderNo" />
						<el-table-column label="消费类型" align="center" prop="consumeType">
							<template slot-scope="scope">
								<dict-tag :options="dict.type.consume_type" :value="scope.row.consumeType" />
							</template>
						</el-table-column>
						<el-table-column label="项目收入" align="center" prop="itemRevenue" />
						<el-table-column label="车费收入" align="center" prop="fareRevenue" />
						<el-table-column label="资金状态" align="center" prop="priceStatus">
							<template slot-scope="scope">
								<dict-tag :options="dict.type.price_status" :value="scope.row.priceStatus" />
							</template>
						</el-table-column>
						<el-table-column label="描述" align="center" prop="consumptionDescribe" />
						<el-table-column label="创建时间" align="center" prop="createTime" width="180">
							<template slot-scope="scope">
								<span>{{ parseTime(scope.row.createTime) }}</span>
							</template>
						</el-table-column>
					</el-table>
					<pagination v-show="total>0" :total="total" :page.sync="queryParams.pageNum"
						:limit.sync="queryParams.pageSize" @pagination="consumeGetList" />
				</el-tab-pane>
			</el-tabs>
		</el-card>


		<el-dialog :title="title" :visible.sync="open" width="500px" append-to-body center>
			<el-form ref="form" :model="form" :rules="rules" label-width="50px">
				<el-form-item label="密码">
					<el-input v-model="prassWord" placeholder="请输入密码" />
				</el-form-item>
			</el-form>
			<div slot="footer" class="dialog-footer">
				<el-button type="primary" @click="submitForm">确 定</el-button>
				<el-button @click="cancel">取 消</el-button>
			</div>
		</el-dialog>



		<el-dialog :title="title" :visible.sync="asOpen" width="1000px" append-to-body center>
			<el-form :model="queryParam" ref="queryForm" size="small" :inline="true" v-show="showSearch"
				label-width="68px">
				<el-form-item label="项目名称" prop="itemName">
					<el-input v-model="queryParam.itemName" placeholder="请输入项目名称" clearable
						@keyup.enter.native="handleQuery" class="elInput" />
					<el-form-item>
						<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
						<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
					</el-form-item>
				</el-form-item>
			</el-form>
			<el-table v-loading="loading" :data="routineItemList" @selection-change="handleSelectionChange">
				<el-table-column type="selection" width="55" align="center" />
				<el-table-column label="ID" align="center" prop="id" />
				<el-table-column label="封面图" align="center" prop="mark">
					<template slot-scope="scope">
						<image-preview :src="scope.row.itemMainPicture" :width="50" :height="50" />
					</template>
				</el-table-column>
				<el-table-column label="服务名称" align="center" prop="itemName" />
				<el-table-column label="服务价格" align="center" prop="itemPrice" />
				<el-table-column label="服务会员价格" align="center" prop="itemMemberPrice" />
				<el-table-column label="服务时长" align="center" prop="itemTime">
					<template slot-scope="scope">
						{{scope.row.itemTime}}分钟
					</template>
				</el-table-column>
			</el-table>
			<pagination v-show="assTotal>0" :total="assTotal" :page.sync="queryParams.pageNum"
				:limit.sync="queryParams.pageSize" @pagination="assonItemList" />
			<div slot="footer" class="dialog-footer">
				<el-button type="primary" @click="assmitForm">确 定</el-button>
				<el-button @click="cancel">取 消</el-button>
			</div>
		</el-dialog>

		<!-- 添加或修改资质管理对话框 -->
		<el-dialog :title="title" :visible.sync="authOpen" width="500px" append-to-body>
			<el-form ref="form" :model="authForm" :rules="rules" label-width="80px">
				<!-- <el-form-item label="技师姓名" prop="tid">
					<el-input v-model="authForm.tid" placeholder="请输入技师姓名" />
				</el-form-item> -->
				<el-form-item label="资质名称" prop="aptitudeName">
					<el-input v-model="authForm.aptitudeName" placeholder="请输入资质名称" />
				</el-form-item>
				<el-form-item label="资质图片" prop="aptitudePicture">
					<image-upload v-model="authForm.aptitudePicture" />
				</el-form-item>
			</el-form>
			<div slot="footer" class="dialog-footer">
				<el-button type="primary" @click="submitAuthForm">确 定</el-button>
				<el-button @click="cancel">取 消</el-button>
			</div>
		</el-dialog>

		<!-- 屏蔽用户 -->
		<el-dialog :title="title" :visible.sync="shielOpen" width="500px" append-to-body>
			<el-form ref="form" :model="authForm" :rules="rules" label-width="80px">
				<el-form-item label="用户姓名" prop="userName">
					<el-input v-model="authForm.userName" placeholder="请输入用户姓名" />
				</el-form-item>
				<el-form-item label="用户手机号" prop="userTel">
					<el-input v-model="authForm.userTel" placeholder="请输入用户手机号" />
				</el-form-item>

			</el-form>
			<div slot="footer" class="dialog-footer">
				<el-button type="primary" @click="submitAuthForm">确 定</el-button>
				<el-button @click="cancel">取 消</el-button>
			</div>
		</el-dialog>


		<!-- 添加或修改银行卡管理对话框 -->
		<el-dialog :title="title" :visible.sync="backOpen" width="500px" append-to-body>
			<el-form ref="form" :model="authForm" :rules="rules" label-width="120px">
				<!-- <el-form-item label="技师姓名" prop="tid">
					<el-input v-model="authForm.tid" placeholder="请输入技师姓名" />
				</el-form-item> -->
				<el-form-item label="银行卡名字" prop="backName">
					<el-input v-model="authForm.backName" placeholder="请输入银行卡名字" />
				</el-form-item>
				<el-form-item label="银行卡号" prop="backIdcard">
					<el-input v-model="authForm.backIdcard" placeholder="请输入银行卡号" />
				</el-form-item>
				<el-form-item label="所属分行" prop="backBranch">
					<el-input v-model="authForm.backBranch" placeholder="请输入所属分行" />
				</el-form-item>
				<el-form-item label="持卡人姓名" prop="backUserName">
					<el-input v-model="authForm.backUserName" placeholder="请输入持卡人姓名" />
				</el-form-item>
			</el-form>
			<div slot="footer" class="dialog-footer">
				<el-button type="primary" @click="submitAuthForm">确 定</el-button>
				<el-button @click="cancel">取 消</el-button>
			</div>
		</el-dialog>

	</div>
</template>

<script>
	import {
		getTechnician,
		addTechnician,
		updateTechnician,
		selTechnician,
		assTechItem,
		selTechDela,
		selectTechItem
	} from "@/api/technician/technician";
	import {
		listRoutineItem
	} from "@/api/routineItem/routineItem";
	import {
		listTechnicianConsumeDetail
	} from "@/api/technicianConsumeDetail/technicianConsumeDetail";
	import {
		listTechnicianBack,
		getTechnicianBack,
		delTechnicianBack,
		addTechnicianBack,
		updateTechnicianBack
	} from "@/api/technicianBack/technicianBack";
	import {
		listTechnicianShield,
		getTechnicianShield,
		addTechnicianShield,
		updateTechnicianShield,
		delTechnicianShield
	} from "@/api/technicianShield/technicianShield";
	import {
		listTechnicianAuthentication,
		getTechnicianAuthentication,
		delTechnicianAuthentication,
		addTechnicianAuthentication,
		updateTechnicianAuthentication,
	} from "@/api/technicianAuthentication/technicianAuthentication";
	import {
		listTechnicianTime,
		updateTechnicianTime
	} from "@/api/technicianTime/technicianTime";
	import {
		listTechnicianType
	} from "@/api/technicianType/technicianType";
	import {
		listMerchant
	} from "@/api/merchant/merchant";
	import {
		listBroker
	} from "@/api/broker/broker";
	export default {
		dicts: ['sys_user_sex', 'consume_type', 'price_status', 'pay_type', 'order_type'],
		data() {
			return {
				prassWord: '',
				// 选中数组
				ids: [],
				activeName: 'first',
				// 遮罩层
				loading: true,
				// 弹出层标题
				title: "",
				// 是否显示弹出层
				open: false,
				asOpen: false,
				authOpen: false, //资质管理
				shielOpen: false, //屏蔽用户
				backOpen: false, //银行卡
				technicianList: [],
				// 服务项目表格数据
				routineItemList: [],
				// 收入明细数据
				technicianConsumeDetailList: [],
				// 银行卡
				technicianBackList: [],
				technicianShildList: [],
				// 资质管理表格数据
				technicianAuthenticationList: [],
				seleceTechList: [],
				// 时间管理表格数据
				technicianTimeList: [],
				// 技师类型表格数据
				technicianTypeList: [],
				merchantList: [],
				brokerList: [],
				//日期选择列表
				checkTime: [],
				//服务列表
				selectItem: [],
				//日期选择内容
				curretDate: {},
				// 总条数
				total: 0,
				assTotal: 0,
				// 查询参数
				queryParams: {
					pageNum: 1,
					pageSize: 10,
				},
				// 查询参数
				queryParam: {
					itemName: null,
				},
				sixParam: {
					userTel: null,
				},
				eightParam: {
					orderNo: null,
					priceStatus: null
				},
				// 显示搜索条件
				showSearch: true,
				// 表单参数
				form: {},
				// 表单参数
				authForm: {},
				// 表单校验
				rules: {
					technicianName: [{
						required: true,
						message: "技师姓名不能为空",
						trigger: "blur"
					}],
					technicianAvatar: [{
						required: true,
						message: "技师头像不能为空",
						trigger: "blur"
					}],
					technicianTel: [{
						required: true,
						message: "技师手机号不能为空",
						trigger: "blur"
					}],
					isOnline: [{
						required: true,
						message: "在线状态不能为空",
						trigger: "change"
					}],
					idCard: [{
						required: true,
						message: "技师身份证不能为空",
						trigger: "change"
					}],
				}
			};
		},
		created() {
			if (this.$route.query.id) this.handleUpdate();
		},
		methods: {
			reset() {
				this.queryParams = {
						pageNum: 1,
						pageSize: 10,
					},
					this.checkTime = []
				this.selectItem = []
				this.routineItemList = []
				this.technicianConsumeDetailList = []
				// this.technicianList = []
				this.technicianBackList = []
				this.technicianShildList = []
				this.technicianAuthenticationList = []
				this.seleceTechList = []
			},
			resetDeta() {
				if (this.activeName == 'five') {
					this.authForm = {
						id: null,
						typeName: null,
						typePicture: null,
						typeState: null,
						isDelete: null,
						createTime: null,
						updateTime: null
					};
				}
				if (this.activeName == 'seven') {
					this.authForm = {
						id: null,
						tid: null,
						backName: null,
						backIdcard: null,
						backBranch: null,
						backUserName: null,
						backLogo: null,
						backColor: null,
						isDelete: null,
						createTime: null,
						updateTime: null
					};
				}
				this.resetForm("authForm");
			},
			/** 搜索按钮操作 */
			handleQuery() {
				this.routineItemList = []
				this.queryParams.pageNum = 1;
				if (this.activeName == 'third') this.assonItemList();
				if (this.activeName == 'six') this.shieldGetList();
				if (this.activeName == 'seven') this.backGetList();
				if (this.activeName == 'eight') this.consumeGetList();
			},
			/** 重置按钮操作 */
			resetQuery() {
				this.resetForm("queryForm");
				if (this.activeName == 'six') this.resetForm("queryFormSix");
				if (this.activeName == 'eight') this.resetForm("queryForm");

				this.handleQuery();
			},
			//查询项目详情
			handleUpdate() {
				this.loading = true;
				getTechnician(this.$route.query.id).then(response => {
					this.form = response.data;
					this.form.isOnline == 1 ? this.form.isOnline = true : this.form.isOnline = false
					if (this.technicianList.length == 0) this.technicianList.push(this.form);
					this.loading = false;

					this.techTypeList()
					this.merchList()
					this.brokeList()
				});
			},
			//查询关联服务列表
			selectItemList() {
				this.queryParams.tid = this.$route.query.id
				selTechnician(this.queryParams).then(response => {
					this.total = response.data.total;
					this.selectItem = response.data.list
				});
			},
			/** 查询服务项目列表 */
			assonItemList() {
				let arr = [],
					a = []
				this.form.serviceItem.split(',').forEach(item => {
					a.push(Number(item))
				})
				this.loading = true;
				this.queryParams = {
					...this.queryParams,
					...this.queryParam
				}
				listRoutineItem(this.queryParams).then(response => {
					response.rows.forEach(item => {
						arr.push(item.id)
					})
					let newArr = this.getNewArr(a, arr)
					for (let i = 0; i < newArr.length; i++) {
						for (let j = 0; j < response.rows.length; j++) {
							console.log(newArr[i])
							if (newArr[i] === response.rows[j].id) {
								this.routineItemList.push(response.rows[j])
							}
						}
					}
					this.assTotal = parseInt(response.assTotal);
					this.loading = false;
				});
			},
			/** 查询收入明细列表 */
			consumeGetList() {
				this.loading = true;
				this.queryParams.tid = this.$route.query.id
				this.queryParams = {
					...this.queryParams,
					...this.eightParam
				}
				listTechnicianConsumeDetail(this.queryParams).then(response => {
					this.technicianConsumeDetailList = response.rows;
					this.total = response.total;
					this.loading = false;
				});
			},
			/** 查询银行卡管理列表 */
			backGetList() {
				this.loading = true;
				this.queryParams.tid = this.form.id
				listTechnicianBack(this.queryParams).then(response => {
					this.technicianBackList = response.rows;
					this.total = response.total;
					this.loading = false;
				});
			},
			/** 查询屏蔽列表 */
			shieldGetList() {
				this.loading = true;
				this.queryParams.tid = this.form.id
				this.queryParams = {
					...this.queryParams,
					...this.sixParam
				}
				listTechnicianShield(this.queryParams).then(response => {
					this.technicianShildList = response.rows;
					this.total = parseInt(response.total);
					this.loading = false;
				});
			},
			/** 查询资质管理列表 */
			authenGetList() {
				this.loading = true;
				this.queryParams.tid = this.form.id
				listTechnicianAuthentication(this.queryParams).then(response => {
					this.technicianAuthenticationList = response.rows;
					this.total = response.total;
					this.loading = false;
				});
			},
			/** 查询服务记录列表 */
			selectGetList() {
				this.loading = true;
				this.queryParams.tid = this.form.id
				selectTechItem(this.queryParams).then(response => {
					this.total = response.data.total;
					this.seleceTechList = response.data.list;
					this.loading = false;
				});
			},
			/** 查询时间管理列表 */
			timegetList() {
				// console.log(typeof( this.curretDate.dates))
				this.loading = true;
				listTechnicianTime({
					technicianId: this.form.id,
					day: this.curretDate.dates,
					pageNum: 1,
					pageSize: 100
				}).then(response => {
					this.technicianTimeList = response.rows;
					this.total = response.total;
					this.loading = false;
				});
			},
			/** 查询技师类型列表 */
			techTypeList() {
				this.loading = true;
				listTechnicianType(this.queryParams).then(response => {
					this.technicianTypeList = response.rows;
					this.total = response.total;
					this.loading = false;
				});
			},
			/** 查询商家管理列表 */
			merchList() {
				this.loading = true;
				listMerchant(this.queryParams).then(response => {
					this.merchantList = response.rows;
					this.total = response.total;
					this.loading = false;
				});
			},
			/** 查询经纪人数据列表 */
			brokeList() {
				this.loading = true;
				listBroker(this.queryParams).then(response => {
					this.brokerList = response.rows;
					this.total = response.total;
					this.loading = false;
				});
			},
			// 新增修改按钮
			/** 服务记录修改按钮操作 */
			handleAdd() {
				this.resetDeta();
				if (this.activeName == 'five') {
					this.authOpen = true;
					this.title = "添加资质管理";
				}

				if (this.activeName == 'six') {
					this.shielOpen = true;
					this.title = "添加屏蔽用户";
				}
				if (this.activeName == 'seven') {
					this.backOpen = true;
					this.title = "添加银行卡";
				}
			},
			authTechDela(row) {
				let getTechType
				if (this.activeName == 'five') getTechType = getTechnicianAuthentication
				if (this.activeName == 'six') getTechType = getTechnicianShield
				if (this.activeName == 'seven') getTechType = getTechnicianBack


				this.resetDeta();
				const id = row.id || this.ids
				getTechType(id).then(response => {
					this.authForm = response.data;
					if (this.activeName == 'five') {
						this.authOpen = true;
						this.title = "添加资质管理";
					}

					if (this.activeName == 'six') {
						this.shielOpen = true;
						this.title = "添加屏蔽用户";
					}
					if (this.activeName == 'seven') {
						this.backOpen = true;
						this.title = "添加银行卡";
					}
				});
			},
			/** 删除按钮操作 */
			authDelete(row) {
				let delTechType
				if (this.activeName == 'five') delTechType = delTechnicianAuthentication
				if (this.activeName == 'six') delTechType = delTechnicianShield
				if (this.activeName == 'seven') delTechType = delTechnicianBack

				const ids = row.id || this.ids;
				this.$modal.confirm('是否确认删除编号为"' + ids + '"的数据项？').then(function() {
					return delTechType(ids);
				}).then(() => {
					this.$modal.msgSuccess("删除成功");
					if (this.activeName == 'five') this.authenGetList()
					if (this.activeName == 'six') this.shieldGetList()
					if (this.activeName == 'seven') this.backGetList()
				}).catch(() => {});
			},


			// 修改密码按钮
			hanldButt() {
				this.open = true;
				this.title = "修改密码";
			},
			// 关联服务按钮
			asociaBut() {
				this.routineItemList = []
				this.asOpen = true;
				this.title = "关联服务";
				this.assonItemList()
			},
			// 取消按钮
			cancel() {
				this.open = false;
				this.asOpen = false
				if (this.activeName == 'five') this.authOpen = false
				if (this.activeName == 'six') this.shielOpen = false
				if (this.activeName == 'seven') this.backOpen = false
				this.resetDeta()
				this.routineItemList = []
			},
			handleSelectionChange(selection) {
				this.ids = selection.map(item => item.id)
			},

			/** 提交按钮 */
			submitForm() {
				this.form.technicianPass = this.prassWord
				// this.form.isOnline ? this.form.isOnline = 1 : this.form.isOnline = 0
				this.form.isOnline = 0
				this.$refs["form"].validate(valid => {
					if (valid) {
						updateTechnician(this.form).then(response => {
							this.handleUpdate();
							this.$modal.msgSuccess("修改成功");
						});
					}
				});
			},
			/** 提交按钮 */
			submitAuthForm() {
				let addTechAuth, updaTechAuth
				if (this.activeName == 'five') {
					addTechAuth = addTechnicianAuthentication
					updaTechAuth = updateTechnicianAuthentication
				}
				if (this.activeName == 'seven') {
					addTechAuth = addTechnicianBack
					updaTechAuth = updateTechnicianBack
				}


				this.$refs["form"].validate(valid => {
					if (valid) {
						if (this.authForm.id != null) {
							updaTechAuth(this.authForm).then(response => {
								this.$modal.msgSuccess("修改成功");
								this.cancel()
								if (this.activeName == 'five') this.authenGetList()
								if (this.activeName == 'seven') this.backGetList()
							});
						} else {
							addTechAuth(this.authForm).then(response => {
								this.$modal.msgSuccess("新增成功");
								this.cancel()
								if (this.activeName == 'five') this.authenGetList()
								if (this.activeName == 'seven') this.backGetList()
							});
						}
					}
				});
			},

			//关联技师
			assmitForm() {
				this.$refs["form"].validate(valid => {
					if (valid) {
						assTechItem({
							tid: this.$route.query.id,
							itemIds: this.ids
						}).then(response => {
							this.reset()
							this.$modal.msgSuccess("修改成功");
							this.handleUpdate()
							this.asOpen = false;
							this.selectItemList()
						});
					}
				});

			},
			// 取消关联
			handleDelete(row) {
				const ids = row.id || this.ids;
				this.$modal.confirm('是否确认取消关联编号为"' + ids + '"的数据项？').then(() => {
					return selTechDela({
						tid: this.form.id,
						itemId: ids
					});
				}).then(() => {
					this.reset()
					this.$modal.msgSuccess("取消成功");
					this.handleUpdate()
					this.selectItemList();
				})
			},

			upDateState(item, state) {
				updateTechnicianTime({
					id: item.id,
					status: state
				}).then(response => {
					this.$modal.msgSuccess("修改成功");
					this.timegetList()
				});
			},

			handleClick(tab, event) {
				this.activeName = tab.name
				this.reset()
				if (this.activeName == 'second') this.nowtimes()
				if (this.activeName == 'third') this.selectItemList()
				if (this.activeName == 'four') this.selectGetList()
				if (this.activeName == 'five') this.authenGetList()
				if (this.activeName == 'six') this.shieldGetList()
				if (this.activeName == 'seven') this.backGetList()
				if (this.activeName == 'eight') this.consumeGetList()

			},
			// 日期选择
			dateChage(item, index) {
				item.index = index
				this.curretDate = item
				this.timegetList()
			},
			timeChage(item, index) {
				if (item.status == 1 || item.status == 2) {
					this.technicianTimeList[index].status = 0
				} else {
					this.technicianTimeList[index].status = 1
				}
				console.log(this.technicianTimeList)
			},
			goBack() {
				this.$commonJs.backRou()
			},



			getNewArr(a, b) {
				const arr = [...a, ...b];
				const newArr = arr.filter(item => {
					console.log(!(a.includes(item) && b.includes(item.id)))
					return arr.indexOf(item) == arr.lastIndexOf(item)
				});
				return newArr;
			},

			// 日期显示
			nowtimes() {
				let that = this
				let now = new Date()
				for (let i = 0; i < 7; i++) {
					//24 * 3600 * 1000 就是计算一天的时间  
					var date = new Date(now.getTime() + i * 24 * 3600 * 1000);
					var year = date.getFullYear();
					var day = date.getDate();
					var dt2 = new Date(now.getTime() + i * 24 * 3600 * 1000);
					var weekDay = ["星期日", "星期一", "星期二", "星期三", "星期四", "星期五", "星期六"];
					var weekDays = ["sun", "mon", "tue", "wed", "thu", "fri", "sat"];
					// var month = ("0" + (now.getMonth() + 1)).slice(-2);
					var month = ("0" + (date.getMonth() + 1)).slice(-2);
					//把七天的时间和星期添加到数组中
					let line = ''
					day < 10 ? line = '-0' : line = '-'
					that.checkTime.push({
						dates: month + line + day,
						// dates: year + "-" + month + "-" + day,
						date: month + "." + day,
						day: day,
						weekday: weekDays[dt2.getDay()],
						week: weekDay[dt2.getDay()],
					});
				}
				that.curretDate = that.checkTime[0]
				that.curretDate.index = 0

				that.timegetList()
				// that.timeList(that.checkTime[0].dates)
			}
		},
	};
</script>

<style scoped lang="less">
	.row {
		display: flex;
		align-items: center;
	}

	.rowFlex {
		display: flex;
		align-items: center;
		justify-content: space-between;
	}

	div {
		cursor: default;
	}

	.mb-md {
		margin-bottom: 20px;
	}

	.c-title {
		color: #333333;
	}

	.elInput {
		width: 300px;
	}


	.box-card {
		margin: 20px;

		.mb-lg {
			margin-bottom: 15px;
		}
	}

	.tech-topView {
		border-bottom: 1px solid #e1e1e1;
		padding-bottom: 10px;

		.el-title-text {
			font-size: 14px;
			color: #666;
			margin-left: 10px;
		}
	}

	.card-formView {
		padding: 20px;

		.rightTitle {
			margin-left: 20px;
		}

		.phoneListTop {
			margin-top: 10px;
		}

		.mt-md {
			margin: 5px 0;
		}

		.mt-mr {
			margin-left: 50px;
		}

		.titleRigId {
			font-size: 14px;
			color: #999;
		}
	}

	.lb-goods-edit-classify {
		width: 100%;
		border-top: 1px solid #eff2f6;
		display: -webkit-box;
		display: -ms-flexbox;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;

		.title {
			display: inline-block;
			padding: 6px 15px;
			color: #609beb;
			background: #f5f7fa;
			margin-right: 10px;
			font-size: 14px;
		}

		.tips {
			color: #fe6c6f;
			font-size: 12px;
		}
	}

	.dialog-footer {
		margin-left: 100px;
	}

	.secondTimes {
		margin: 20px;

		.lines {
			width: 30px;
			height: 3px;
			border-radius: 2px;
			background: rgb(64, 158, 255);
			margin: 0 auto;
		}

		.mr-sr {
			margin-right: 30px;
		}

		.s-title {
			font-size: 16px;
			color: #444;

			span {
				display: inline-block;
				margin-bottom: 10px;
			}
		}

		.timeChangeBox {
			margin-top: 20px;
			flex-wrap: wrap;

			.date-item {
				width: 82px;
				height: 50px;
				border: 1px solid #e5e5e5;
				background: #e5e5e5;
				line-height: 25px;
				text-align: center;
			}

			.can-service {
				border-color: #19c865;
				background: #fff;
				color: #19c865;
			}

			.f-mini-title {
				font-size: 15px;
			}

			.f-caption {
				font-size: 12px;
			}

			.mr-md {
				margin-right: 10px;
			}

			.radius-10 {
				border-radius: 5px;
			}

			.mt-md {
				margin-top: 10px;
			}

			// margin: 0px auto;
			// display: grid;
			// justify-content: space-between;
			// grid-template-columns: repeat(auto-fill, 220px);
		}

		.cureTit {
			font-size: 18px;
			color: rgb(64, 158, 255);
		}
	}


	.elTable {
		margin-top: 30px;
	}

	.fourSelectInfo {
		margin-left: 10px;
		text-align: left;

		.fourName {
			font-size: 12px;
			color: #444;
		}

		.fourTime {
			color: #999;
			font-size: 10px;
		}

		.fourPrice {
			color: #f12c20;
		}
	}

	.ellipsis {
		display: block;
		overflow: hidden;
		white-space: nowrap;
		text-overflow: ellipsis;
	}

	.el-form-item {}

	/deep/.el-table__header {
		height: 60px !important;
	}

	/deep/.pagination-container {
		padding: 0 !important;
	}

	.el-form-item--medium .el-form-item__content {
		line-height: 0;
	}
</style>